<template>
  <div class="accountadd">
    <h3>添加账号</h3>
    <hr />
    <form>
      <p>
        <span>账号</span>
        <el-input
          placeholder="账号"
          v-model="user"
          clearable
          style="width: 300px"
        >
        </el-input>
      </p>
      <p>
        <span>密码</span>
        <el-input
          placeholder="请输入密码"
          v-model="pwd"
          show-password
          style="width: 300px"
        ></el-input>
      </p>
      <p>
        <span>用户组</span>
        <el-select v-model="group" placeholder="请选择" style="width: 300px">
          <el-option
            lable='普通管理员' value="普通管理员"
          >
          </el-option>
          <el-option
            lable='超级管理员' value="超级管理员"
          >
          </el-option>
        </el-select>
      </p>
      <p>
        <span></span>
        
        <el-button type="primary" @click="addclick">添加账号</el-button>
      </p>
    </form>
  </div>
</template>

<script>
import {adduser} from '@/apis/users'

export default {
  data() {
    return {
      user: "",
      pwd: "",
      group:'普通管理员'
      
    };
  },
  methods:{
    addclick() {
      console.log(this.user, this.pwd, this.group);

      adduser({account: this.user,password: this.pwd,userGroup: this.group,}).then((res) => {
        console.log(res);
      });
    },
  }
};
</script>

<style lang="less" scoped>
.accountadd {
  h3 {
    padding: 20px 0;
  }
  p {
    display: flex;
    margin: 20px;
    span {
      width: 50px;
      margin-right: 30px;
      text-align: right;
    }
  }
}
</style>